const { task,start,series,src, dest,watch } = require('gulp');
const babel = require('gulp-babel');
const uglify = require('gulp-uglifyes');


const imagemin = require('gulp-imagemin');
const pngquant = require('imagemin-pngquant');
const cache = require('gulp-cache');


const del = require('delete');
const spritesmith = require('gulp.spritesmith');

const rename = require('gulp-rename'); 


//css压缩
const minifyCss = require('gulp-minify-css');

const rev= require('gulp-rev');
//html 替换css,js语言件

const revCollector = require('gulp-rev-collector');


const transport = require("gulp-seajs-transport");
const concat = require("gulp-seajs-concat");


const browserSync = require('browser-sync').create();

//压缩css任务
function css(cb){
    if (process.env.NODE_ENV == 'prod') {
    src('src/css/*.css')
        .pipe(minifyCss())
        // .pipe(rename({
        //     suffix: ".min",
        //     extname: ".css"
        // }))
        .pipe(dest('dist/css/'));
    } else {
        src('src/css/*.css')
        .pipe(dest('dist/css/'));
    }
    cb();
}
//压缩js
function js(cb) {

    console.log(process.env.NODE_ENV);

    if (process.env.NODE_ENV == 'prod') {
        src(['src/js/*.js', 'src/libs/*.js'])
        .pipe(transport({
        	idleading:"/js/"
        }))
        .pipe(concat({
            base: "/js/"
        }))
        .pipe(babel())
        .pipe(uglify({
            mangle:{
                reserved: ['require', 'exports', 'module','define','sea', 'seajs', 'sea.js', '$', 'Zepto', 'jQuery', '_hmt'] //这几个变量不压缩
            }
        }))
     
        // .pipe(rename({
        //      	suffix: ".min",
        //      	extname: ".js"
        //      }))
        // .pipe(rev())
        .pipe(dest('dist/js/'))
        // .pipe(rev.manifest())                       //- 生成一个rev-manifest.json
        // .pipe(dest('dist/rev-js/'))
    } else {
        src('src/js/*.js')
        .pipe(babel())
        // .pipe(uglify())
        // .pipe(rename({
        //      	suffix: ".min",
        //      	extname: ".js"
        //      }))
        // .pipe(rev())
        .pipe(dest('dist/js/'))
        // .pipe(rev.manifest())                       //- 生成一个rev-manifest.json
        // .pipe(dest('dist/rev-js/'))
    }
   
    cb();
}

//图片
function img(cb) {
    return src("src/imgs/*.{png,jpg,gif,ico}")
        // .pipe(cache(imagemin({
        //     progressive: true,
        //     svgoPlugins: [{removeViewBox: false}],//不要移除svg的viewbox属性
        //     use: [pngquant()] //使用pngquant深度压缩png图片的imagemin插件
        // })))

        .pipe(cache(imagemin({
            progressive: true,
            svgoPlugins: [{removeViewBox: false}],//不要移除svg的viewbox属性
            use: [pngquant()] //使用pngquant深度压缩png图片的imagemin插件
        })))

        // .pipe(imagemin())
        .pipe(dest("dist/imgs/"))
    cb();
}

//合成sprite图
function sprite() {
    del("dist/icons/*");
    return src("src/icons/*.{png,jpg,gif,ico}")
        .pipe(spritesmith({
            imgName: `icons.png`,
            cssName: 'icons.css',
            algorithm: 'binary-tree',
            padding: 6,
            cssVarMap: function(sprite) {
                sprite.name = sprite.name;
            }
        }))
        
        .pipe(dest("dist/icons/"))       
}

function html () {
    del.sync('dist/*.html');
    return src(['dist/**/rev-*.json', 'src/*.html', 'src/js/*.js'])
        
        .pipe(revCollector({
            replaceReved: true
        }))
        // .pipe(chsiRev())
        // .pipe(minifyHtml())
        .pipe(dest('dist/'));
}

function clean(cb) {
    del("dist/*");
    cb();
}

function libs(cb) {
    src("src/libs/*.js")
    .pipe(dest("dist/libs/"));
    cb();
}

// 静态服务器
function browserSyncFn() {
    browserSync.init({
        server: {
            baseDir: "./dist/",
            directory: true
        }
    });
}

exports.default = series(clean,libs,js,css,sprite,html,browserSyncFn);

watch('src/js/*.js', series(js,html));
watch('src/libs/*.js', series(libs,html));
watch("src/imgs/*.{png,jpg,gif,ico}", series(img,html));
watch("src/*.html", html);


exports.js = js;
exports.img = img;
exports.sprite = sprite;
exports.css = css;
exports.html = html;
